<template>
	<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
		<el-tab-pane label="概览" name="profile">User</el-tab-pane>
		<el-tab-pane label="属性" name="attr">
      <Attrs></Attrs>
    </el-tab-pane>
	</el-tabs>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import type { TabsPaneContext } from 'element-plus'
import Attrs from './Attrs.vue'
const activeName = ref('attr')

const handleClick = (tab: TabsPaneContext, event: Event) => {
  console.log(tab, event)
}
</script>
<style lang="less" scoped>
::v-deep {
  .el-tabs__nav-scroll{
    padding-left: 20px;
  }
  .el-tabs__content{
    padding: 0 20px;
  }
}
</style>